<style type="text/less">@import "/web/public/public.less";

    #special-top-module {
        width: 1213px;
        padding: 22px;
        border: 1px solid #eeeeee;
        margin-top: 30px;

        .st_ul_box_title {
            overflow: hidden;
            white-space: nowrap;
            height: 43px;
            line-height: 43px;
            h2 {
                display: inline-block;
                color: #333333;
            }
            a {
                font-family: MicrosoftYaHei-Bold;
                font-size: 38px;
                font-weight: bold;
                font-stretch: normal;
                letter-spacing: 1px;
                color: #333333;
            }
        }

        ul {
            list-style: none;
            width: 100%; //均分三个一行
            margin-left: -4px;

            li {
                margin-top: 30px;
                height: 24px;
                line-height: 24px;
                margin-left: 4px;
                display: inline-block; //控制横向排列
                width: calc(~"100%/3 - 15px"); //均分三个一行
                overflow: hidden; //子项超出隐藏
                white-space: nowrap; //子项强制一行显示

                i {
                    font-size: 24px;
                    margin-top: -5px;
                    color: #333333;
                    margin-right: 6px;
                }
                h3 {
                    color: #333333;
                    display: inline-block;
                }
                .ul_box_li {
                    font-family: MicrosoftYaHei;
                    font-size: 20px;
                    font-weight: normal;
                    font-stretch: normal;
                    letter-spacing: 0px;
                    color: #333333;
                }

            }

        }
    }
</style>
<script src="/web/lib/less.min.js"></script>
<#if title?? && title.status == 1>
    <div id="special-top-module">
        <div class="st_ul_box_title">
            <#if title.url!="">
                <h2><a id="id_st_title_a" href="${title.url}" target="_blank"> <span>${title.title}</span></a></h2>
                <#else>
                <h2><a href="javascript:"> <span>${title.title}</span></a></h2>
            </#if>
        </div>
        <ul id="id_st_ul">
            <#list list as info>
                <#if info.url!="">
                    <li>
                        <i class="iconfont icon-shejiwenzhang"></i>
                        <h3><a href="${info.url}" target="_blank"><span class="ul_box_li">${info.title}</span></a></h3>
                    </li>
                <#else>
                    <li>
                        <i class="iconfont icon-shejiwenzhang"></i>
                        <h3><a href="javascript:"><span class="ul_box_li">${info.title}</span></a></h3>
                    </li>
                </#if>
            </#list>
        </ul>
    </div>
</#if>
<script>
    $(function () {
        //大标题无连接时鼠标经过变箭头有链接时鼠标经过变手
        var $id_st_title_a = $('#id_st_title_a');
        //大标题和列表中点击后页面内存记录并显示已点样式
        $id_st_title_a.click(function () {
            $(this).children('span').css("color", "#666666");
        });
        var $id_st_ul_li_a = $('#id_st_ul li a');
        $id_st_ul_li_a.click(function () {
            $(this).children('span').css("color", "#999999");
        });

        /*    //更新页列表数据
            var $id_st_ul = $('#id_st_ul')[0];
            var setUlByItem = function (items) {
                var bufHtml = ""; // 声明一个空字符串容器
                for (var k of items) { // 循环遍历数组 拼接li标签部分和字符串内容
                    bufHtml +=
                        '            <li>' +
                        '                 <i class="iconfont icon-shejiwenzhang"></i>' +
                        '                 <a href="' + k.channelUrl + '" target="_blank"><span class="ul_box_li">' + k.channelName + '</span></a>' +//if有链接<!--20210225-->
                        '                 <a href="javascript:"><span class="ul_box_li">' + k.channelName + '</span></a>' +//else无连接<!--20210225-->
                        '            </li>';
                }
                $id_st_ul.innerHTML = bufHtml;
            }
            // //联网获取一页数据
            // setUlByItem(obj.data.list);*/
    });
</script>